<script>
import { deepClone } from '@/utils'
export default {
  name: 'CTableBox1',
  // abstract: true,
  props: {
    index: {
      type: Boolean,
      default: true
    },
    checkbox: {
      type: Boolean,
      default: false
    },
    setting: {
      type: Boolean,
      default: true
    },
    hideFunc: {
      type: Boolean,
      default: false
    },
    hideSetting: {
      type: Boolean,
      default: false
    },
    combine: {
      type: Boolean,
      default: true
    },
    tableConfig: {
      type: Object,
      default: () => ({
        setting: []
      })
    },
    data: {
      type: Array,
      default: undefined
    }
  },
  data() {
    return {
    }
  },
  created() {
  },
  mounted() {
    // this.$parent.$refs = this.$refs
  },
  methods: {
    getTableBox() {
      return this.$refs.table
    },
    initTableData(v) {
      this.getTableBox().initTableData(v)
    },
    refreshTableHeight() {
      this.getTableBox().refreshTableHeight()
    }
  },
  render(h) {
    const tableConfig = deepClone(this.tableConfig)
    // tableConfig.onlySearchBar = true
    tableConfig.hideSearchBar = true
    tableConfig.hideFuncBar = false
    const scopedSlots = { ...this.$scopedSlots }
    delete scopedSlots.btn
    tableConfig.btnList = tableConfig.btnList || []
    if (this.$scopedSlots.btn) {
      for (const b of this.$scopedSlots.btn()) {
        if (b.tag === undefined) continue
        const attrs = ((b.data || {}).attrs || {})
        const optCode = attrs.optCode || attrs['opt-code']
        if (optCode === undefined) continue
        tableConfig.btnList.push({
          buttonName: attrs.name || '没有设置name',
          optCode,
          outerFlag: true
        })
      }
    }
    const listeners = { ...this.$listeners }
    delete listeners.btnOperate
    const tData = {
      props: {
        ...this.$attrs,
        tableConfig,
        showIndex: this.index,
        showSelection: this.checkbox,
        showCustomCombine: this.combine,
        showCustomSetting: this.setting
      },
      scopedSlots,
      ref: 'table', on: {
        ...listeners,
        btnOperate: flag => {
          console.log(flag)
        }
      }
    }
    if (this.data !== undefined) {
      tData.props.noRequest = true
      tData.props.data = this.data
    }
    const tb = h('table-box', tData)
    if (!this.hideFunc) {
      return tb
    }
    return tb
    // let btnVnode = h('div')
    // if (this.$scopedSlots.btn) {
    //   btnVnode = h('div', { class: 'cus-btn' }, this.$scopedSlots.btn())
    // }
    // let btnSet = h('div')
    // if (this.setting) {
    //   btnSet = h('el-button', { props: { icon: 'el-icon-setting' }, on: {
    //     click: () => {
    //       this.$refs.table.showTableSetting()
    //       this.$refs.table.showSetting = true
    //     }
    //   }}, '表格设置')
    // }
    // const btnBox = h('div', { class: 'btn-box', style: {
    //   height: this.setting ? 'auto' : '0px'
    // }}, [btnVnode, btnSet])
    // if (this.$scopedSlots.default) {
    //   tb = h('table-box', tData)
    // }
    // return h('div', [btnBox, tb])
  }
}
</script>
<style lang="scss" scoped>
.btn-box{
  display: flex;
  justify-content: space-between;
  height: 33px;
  // margin-bottom: 10px;
  .cus-btn{
    display: flex;
    flex-wrap: wrap;
    /deep/ .container{
      min-height: auto !important;
    }
  }
}
</style>
